<template>
  <div class="contentWrapper wpx1200" id="contentWrapper">
    <el-card class="box-card mt20" v-loading="loading">
		  <div slot="header" class="clearfix">
		  	<img src="../../../../static/img/header/lianjie.png" alt="" class="cardbg"/>
		    <span>网站检测</span>
		  </div>
		  <div>
		  	<div class="cardContentTop">
		  		 <el-form ref="form"  label-width="88px">
					  <myselect  v-on:selectevent="selectevent"></myselect>
					  <el-form-item label="检测范围:">
					  	<el-input type="textarea" v-model="urls" placeholder="输入检测网页链接，用逗号间隔" class="inputWrapper floatl mr20"></el-input>
					    <!--<el-input v-model="urls" class="inputWrapper floatl mr20" placeholder="输入检测网页链接，用回车间隔"></el-input>--> 
					    <!--<span class="floatl mr20">或</span>
					    <div class="floatl">
					    	 <el-upload
									  class="upload-demo"
									  action="https://jsonplaceholder.typicode.com/posts/"
									  :on-preview="handlePreview"
									  :on-remove="handleRemove"
									  :before-remove="beforeRemove"
									  multiple
									  :limit="3"
									  :on-exceed="handleExceed"
									  :file-list="fileList"
									  >
									  <el-button size="small" type="primary">点击上传</el-button>
									</el-upload>
					    </div>-->
					   
					  </el-form-item>
					  <div class="mt50 pt50 mb30 pb40 clearFix">
							<div class="floatl">
								<el-button type="primary" size="small" @click="checkUrl()">计算价格</el-button>
							</div>
					  </div>
					</el-form>
		  	</div>
		  </div>
		</el-card>
  </div>
</template>

<script>
	import API from "@/api"
	import myselect from "@/components/parts/select/select"
export default {
  name: 'urlCheck',
   components : {
    myselect
  },
  data () {
    return {
    	fileList: [],
    	list:[],
      wordIndex:'',
      urls:'',
      loading: false,
      taskName: ""
    }
  },
  created: function(){
  		
  },
   mounted: function () {
//	this.getList()
		setMinHeight("contentWrapper");
		$(window).resize(function() {
		  setMinHeight("contentWrapper")
		});
  },
   methods: {
   	selectevent(data){
   		this.list = data;
   	},
	  checkUrl(){
	  	if(this.list.length == 0){
					this.$message.error('请先选择关键字');
	  			return
	  	}
    	if(this.urls == ''){
    		this.$message.error('请先填写链接');
	  			return
    	}else{
    		this.urls = this.urls.replace(new RegExp('，','g'),',')
    	}
    	var listInfo = this.list;
    	this.taskName =  getNowFormatDate();
//  	console.error(url)
//  	return
    	var checkInfo = {
													info: {
														"content":this.urls,
														"wordList":(listInfo.wordTxt).replace(new RegExp('，','g'),','),
														"wordId":listInfo.wordId,
														taskName: this.taskName
													},
													token: API.header.getCookie("token"),
													url: "checkhtml"
												}
    	this.loading = true;
			API.check.check(checkInfo).then(({data}) => {
    			this.loading = false;
		       if(data.code=='0'){
		       		sessionStorage.setItem("urlResult",JSON.stringify(data.data))
		       		sessionStorage.setItem("urlList",JSON.stringify(data.list))
		       		sessionStorage.setItem("urlWordList",checkInfo.info.wordList)
		       		sessionStorage.setItem("urlKeyWordNum",API.check.getKeyWordNum(this.list.wordTxt))
		       		
		       		
		       		this.$router.push({
					      name: 'urlResult',
					   })
		       }else{
						this.$message.error(data.msg);
		       }
	      })
	  },
	  handleRemove(file, fileList) {
	    console.log(file, fileList);
	  },
	  handlePreview(file) {
	    console.log(file);
	  },
	  handleExceed(files, fileList) {
	    this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
	  },
	  beforeRemove(file, fileList) {
	    return this.$confirm(`确定移除 ${ file.name }？`);
	  }
	}
  
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	#app {
		/*text-align: left;*/
	}
	.cardContentTop {
		width: 800px;
    margin: 0 auto;
	}
	
</style>
